import React from 'react';
import { Radio } from 'antd';
import { genID } from '@/utils/utils';
import styles from './index.less';

/**
 *
 * @param {number} col 要分成几列
 * @param {number} list 需要渲染的数据源
 */
// 取消箭头函数自动格式化
// eslint-disable-next-line arrow-body-style
const RadioButton = React.forwardRef(({ col, list = [], ...otherprops }, ref) => {
    return list.length ? (
        <Radio.Group defaultValue="a" className={styles.customRadio} {...otherprops} ref={ref}>
            {list.map(radio => (
                <Radio.Button
                    key={genID()}
                    style={
                        typeof col === 'number' && col !== 0
                            ? { width: `calc(${100 / col}%${col !== 1 ? ' - 10px' : ''})` }
                            : null
                    }
                    value={radio.value}
                >
                    {radio.label}
                </Radio.Button>
            ))}
            <span
                style={{
                    ...{ height: 0 },
                    ...(typeof col === 'number' && col !== 0
                        ? { width: `calc(${100 / col}%${col !== 1 ? ' - 10px' : ''})` }
                        : {})
                }}
            />
        </Radio.Group>
    ) : null;
});

export default RadioButton;
